<template>
	<view class="list">

		<view v-for="item in list1">

			<view class="item">
				<view class="left">
					<view style="margin-right: 23rpx;">
						
						<image v-if="item.plat" class="photo" :src="allPlat.filter(r=>r.code==item.plat)[0].icon" mode="widthFix">
						
					<!-- 	<image class="photo" src="https://wuyouzhuanapp.oss-cn-beijing.aliyuncs.com/27.png"
							mode="widthFix"></image> -->
					</view>
					<view class="info">
						<view class="name">
							任务编号:{{item.job_code}}
							
						</view>
						<view class="name">
							<image v-if="item.plat" :src="allPlat.filter(r=>r.code==item.plat)[0].icon" mode="widthFix">
							
							<!-- <image src="https://mk001.oss-cn-hangzhou.aliyuncs.com/jdrwpt/1.png" mode=""></image> -->
							{{item.title}}
						</view>
						<view class="money">
							{{item.yonjin}}元/条
							<u-tag class="tag" size="mini" text="进行中" mode="plain" />
						</view>
					</view>
				</view>

				<view class="">
					<view class="">
						<u-tag class="u-m-b-20" shape="circle"  text="提交任务" mode="dark" />
					</view>
					<view class="time">
						3分钟前
					</view>
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	export default {
		// props: ['current'],
		props: ['list1','current'],
		data() {
			return {
allPlat: [{
						name: "抖音任务",
						icon: "http://cdn.haipiwan.com/icon/icon_dy.png",
						code: "dy",
					},
					{
						name: "小红书任务",
						icon: "http://cdn.haipiwan.com/icon/icon_xhs.png",
						code: "xhs",
					},
					{
						name: "快手任务",
						icon: "http://cdn.haipiwan.com/icon/icon_ks.png",
						code: "ks",
					},
					{
						name: "视频号任务",
						icon: "http://cdn.haipiwan.com/icon/icon_sph.png",
						code: "sph",
					},
					{
						name: "咸鱼任务",
						icon: "http://cdn.haipiwan.com/icon/icon_xy.png",
						code: "xy",
					}
				],
			}
		}
	}
</script>

<style scoped lang="scss">
	.list {
		// margin: 0 32rpx;

		.item {
			padding: 32rpx 0 25rpx;

			display: flex;
			align-items: center;
			justify-content: space-between;
			border-bottom: 1rpx solid #eeeeee;

			&:last-child {
				border-bottom: none;
			}

			.left {
				display: flex;
				align-items: center;

				.photo {
					width: 100rpx;
					height: 100rpx;
					margin: 0 auto;
					display: block;
					border-radius: 50%;

				}

				.name {
					font-size: 27rpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					// line-height: 32rpx;
					display: flex;
					align-items: center;
					image{
						width: 26rpx;
						height: 26rpx;
						margin-right: 10rpx;
					}
				}

				
			}
			.time {
				font-size: 24rpx;
				font-family: PingFang SC-Light, PingFang SC;
				font-weight: 300;
				color: #666666;
				line-height: 28rpx;
				margin-top: 5rpx;
				text-align: center;
			}

			.money {
				font-size: 28rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: #35AC6C;
				// line-height: 38rpx;
				display: flex;
				align-items: center;
				.tag{
					margin-left: 20rpx;
				}
			}
		}
	}
</style>
